<script setup>
import { useUserStore } from '@/stores/user';
import { EiInfo } from '@eplat/ei';
import SERVICE from '@/api/example';
import { Toast } from 'vant';

const router = useRouter();

const user = useUserStore();

const loginName = ref(user.loginName);
const oldPassword = ref('');
const password = ref('');
const rePassword = ref('');

const onSubmit = async () => {
  const ei = new EiInfo();
  ei.set('loginName', loginName.value);
  ei.set('oldPassword', oldPassword.value);
  ei.set('password', password.value);
  ei.set('rePassword', rePassword.value);
  Toast.loading('修改中');
  try {
    await SERVICE.changePassword(ei).then((res) => {
      if (res.getStatus() === 1) {
        Toast.success('修改成功');
        setTimeout(() => {
          router.back();
        }, 1000);
      } else {
        Toast(res.getMsg());
      }
    });
  } catch (err) {
    Toast('内部异常');
  }
};
</script>

<template>
  <XPage title="修改密码">
    <van-form class="form-card" @submit="onSubmit">
      <van-cell-group class="form-cell-group" inset>
        <van-field v-model="loginName" label="登录账号" readonly />
        <van-field v-model="oldPassword" label="旧密码" placeholder="请输入旧密码" />
        <van-field v-model="password" label="新密码" placeholder="请输入新密码" />
        <van-field v-model="rePassword" label="确认密码" placeholder="请再次输入密码" />
      </van-cell-group>
      <van-button native-type="submit" type="primary" block>确认修改</van-button>
    </van-form>
  </XPage>
</template>

<style lang="stylus" scoped>
.form-card

  .form-cell-group
    margin 12px
</style>
